<template>
  <div class="login">
    <div class="login-con">
      <Card icon="log-in" title="欢迎登录" :bordered="false">
        <div class="form-con">
          <login-form @pHandleSubmit="handleSubmit"></login-form>
        </div>
      </Card>
    </div>
  </div>
</template>
<script>
  import LoginForm from '@/components/base/loginForm'
  import { mapActions } from 'vuex'

  export default {
    name: 'vLogin',
    components: {
      LoginForm
    },
    data() {
      return {
        title: ''
      }
    },
    computed: {
    },
    methods: {
      ...mapActions(['handleLogin', 'getUserInfo']),
      handleSubmit ({ userName, password }) {
        this.$router.push({
          path:'/home',
          query:{
            userName:userName,
            password:password
          }
        })
        /*this.handleLogin({userName,password}).then(res => {
          this.getUserInfo().then(res => {
            this.$router.push({
              name: this.$config.homeName
            })
          })
        })*/
      }
    }
  }
</script>
<style scoped lang="scss">
  .login {
    width: 100%;
    height: 100%;
    background-image: url('../assets/login-bg.jpg');
    background-size: cover;
    background-position: center;
    position: relative;

    &-con {
      position: absolute;
      right: 160px;
      top: 50%;
      transform: translateY(-60%);
      width: 300px;

      &-header {
        font-size: 16px;
        font-weight: 300;
        text-align: center;
        padding: 30px 0;
      }

      .form-con {
        padding: 10px 0 0;
      }

      .login-tip {
        font-size: 10px;
        text-align: center;
        color: #c3c3c3;
      }
    }
  }

</style>
